<template>
	<div id="container">
		<header>
			<van-nav-bar
			  title="签到中心"
			  left-text="返回"
			  left-arrow
			  @click-left="onClickLeft"			
			/>
		</header>
		<div id="content">
			<!-- content-show -->
			<div class="sign-show">
				 <h2>您有<span>{{num}}</span>鸥点</h2>
				 <h2>本月已签到<span>{{day}}</span>天</h2>
				 <van-button type="default" @click="sign()">签到得好礼</van-button>
			</div>
			<!-- sign-gift -->
			<div class="sign-gift">
				<van-button plain type="info">连续签到五天赢签到礼包</van-button>
			</div>
			<!-- sign-item -->
			<div class="sign-item">
				<van-icon name="edit" />
				<h3>您还没有礼包记录</h3>
			</div>
		</div>
		
		
		
	</div>
</template>

<script>
import * as api from '../../api/getproductlist'
import axios from 'axios'
	export default{
		name:'Sign',
		data(){
			return{
				num:0,
				day:0
			}
		},
		methods:{
			onClickLeft(){
				this.$router.go(-1)
            },
            sign(){
                let token=this.$store.state.tokens
				let uid=this.$store.state.uids
				let date=new Date()
				let y=date.getFullYear()
				let m=date.getMonth()+1
				m=''+m
				if(m.length<2){
					m='0'+m
				}
				let r=date.getDate()
				r=''+r
				if(r.length<2){
					r='0'+r
				}
				let html=''
				html=`${y}${m}${r}`

				
                api.sign({uid:uid,date:html},{headers:{token:token}}).then(data=>{if(data.data.code==400){this.$toast.fail('今日已签到')}
                else{this.$toast.success('签到成功')
                    api.getsign({uid:uid}).then(data=>{
               let res=data.data.data;
               this.num=res[0].ou
               this.day=res[1].day
           })
		        }})
		
            }
        },
        mounted(){
    		let token=this.$store.state.tokens
			let uid=this.$store.state.uids
           api.getsign({uid:uid}).then(data=>{
               let res=data.data.data;
               this.num=res[0].ou
               this.day=res[1].day
           })
        }
	}
</script>

<style scoped>
	h1,h2,h3,h4{
		padding: 0;
		margin: 0;
	}
	#container{
		height: 100vh;
		background: #fff;
	}
	/* -------------header-------- */
	header .van-nav-bar{
		height:48px;
		background: #f65050;
	}
	header .van-nav-bar__title{
		font-size:18px;
		font-weight:600;
		font-family:"楷体";
		color:#fefafb;
	}
	.van-nav-bar__text,.van-nav-bar__arrow{
		color:#fefafb;
		font-size:16px;
	}
	header .van-nav-bar__text{
		font-family: "楷体";
		font-weight:500;
	}
		/* -------------------sign-content-show------------ */
	
	.sign-show{
		height: 166px;
		background:#f65050;
		overflow: hidden;
		position: relative;
	}
	.sign-show h2{
		color: #ffffff;
		font-weight: 500;
		font-family: "楷体";
		margin: 30px 0px 0px 42px;
		font-size: 20px;
	}
	.sign-show .van-button{
		height:38px;
		width:107px;
		border-radius: 7px;
		color:#f0282b;
		line-height: 38px;
		position:absolute;
		top:40px;
		right:21px;
	}
/* --------------------sign-gift--------------------------- */
.sign-gift{
	border-bottom: 1px solid #bec4c4;
}
.van-button--info{
	color:#832933;
	border-color:#82605f;
	margin: 21px 0px 21px 23px;
}
/* -------------------sign-item----------------- */
	.sign-item {
		text-align: center;
	}
	.sign-item .van-icon-edit{
		font-size: 150px;
		color: #c0c4c7;
		margin-top:90px;
	}
	.sign-item h3{
		font-family: "楷体";
		font-size: 20px;
		color: #929292;
		font-weight: 600;
	}

</style>
